<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <th:block th:include="include :: header('报名信息列表')" />
</head>

<body class="gray-bg" id="parentBody">

    <div class="container-div">
        <div class="row">
            <!--    搜索模块    -->
            <div class="col-sm-12 search-collapse">
                <form id="formId">
                    <div class="select-list">
                        <ul>
                            <li>
                                <p>姓名：</p>
                                <input type="text" name="volunteerName"/>
                            </li>

                            <li>
                                <p>申请部门：</p>
                                <select name="sectorId" th:with="type=${@dict.getType('sector')}">
                                    <option value="">所有</option>
                                    <option th:each="dict : ${type}" th:text="${dict.dictLabel}"
                                            th:value="${dict.dictValue}"></option>
                                </select>
                            </li>

                            <li>
                                <p>学院名称：</p>
                                <select name="academyId" th:with="type=${@dict.getType('academy')}">
                                    <option value="">所有</option>
                                    <option th:each="dict : ${type}" th:text="${dict.dictLabel}"
                                            th:value="${dict.dictValue}"></option>
                                </select>
                            </li>

                            <li>
                                <p>最高学历：</p>
                                <select name="volunteerDegree" th:with="type=${@dict.getType('degree')}">
                                    <option value="">所有</option>
                                    <option th:each="dict : ${type}" th:text="${dict.dictLabel}"
                                            th:value="${dict.dictValue}"></option>
                                </select>
                            </li>

                            <!-- 需要自己写sql条件 -->
                            <li class="select-time">
                                <p>申请时间：</p>
                                <input type="text" class="time-input" id="startTime" style="width: 133px" placeholder="请选择开始时间" name="beginDate"/>
                                <span>至</span>
                                <input type="text" class="time-input" id="endTime" style="width: 133px" placeholder="请选择结束时间" name="endDate"/>
                            </li>
                            <li>
                                <a class="btn btn-success btn-sm" onclick="$.table.search()"><i class="fa fa-search"></i>搜索</a>
                                <a class="btn btn-warning btn-sm" onclick="reset()"><i class="fa fa-refresh"></i>&nbsp;重置</a>
                            </li>
                        </ul>
                    </div>
                    <!--    额外搜索条件   -->
                    <input name="enrollState" value="1" id="enrollState" style="display: none"/>
                </form>
            </div>

            <!--    功能模块    -->
            <div class="btn-group-sm" id="toolbar" role="group">
                <a class="btn btn-white" onclick="dai()">待选拔</a>
                <a class="btn btn-white" onclick="yi()">已录用</a>
                <a class="btn btn-white" onclick="wei()">未录用</a>
                <br/>
                <a class="btn btn6 btn-success" onclick="$.table.exportExcel()">
                    <i class="fa fa-send"></i> 导出名单
                </a>
                <a class="btn btn7 btn-danger" onclick="addMember()" style="display:none;">
                    <i class="fa fa-remove"></i> 添加成员
                </a>
            </div>

            <!--    信息表格    -->
            <div class="col-sm-12 select-table table-striped">
                <table id="bootstrap-table">
                    <thead>
                    <tr>
                        <th data-checkbox="true"></th>
                        <th data-formatter="fm_rowIndex" data-align="center">序号</th>
                        <th data-field="volunteerCode" data-align="center">志愿者编号</th>
                        <th data-field="volunteerName" data-align="center">姓名</th>
                        <th data-field="sectorName" data-align="center">部门</th>
                        <th data-field="sexName" data-align="center">性别</th>
                        <th data-field="volunteerAcademy" data-align="center">学院</th>
                        <th data-field="volunteerProfession" data-align="center">专业</th>
                        <th data-field="volunteerDate" data-align="center">入队时间</th>
                        <th data-field="postName" data-align="center">报名岗位</th>
                        <th data-field="createTime" data-align="center">报名时间</th>
                        <th data-formatter="fm_commands" data-width="120px" data-align="center">操作</th>
                    </tr>
                    </thead>
                </table>
            </div>
        </div>
    </div>

    <th:block th:include="include :: footer" />
    <script id="parent-script" th:inline="javascript">
        /** 初始配置——路径配置，字典配置 */
        var editFlag = [[${@permission.hasPermi('vtsp:volunteer:edit')}]];
        var removeFlag = [[${@permission.hasPermi('vtsp:volunteer:remove')}]];
        var prefix = ctx + "vtsp/enroll";

        //  路径变量初始化
        $(function() {
            var options = {
                url: prefix + "/list/[[${activityId}]]",
                createUrl: prefix + "/add",
                updateUrl: prefix + "/edit/{id}",
                removeUrl: prefix + "/remove",
                exportUrl: prefix + "/export",
                modalName: "志愿者信息",
                uniqueId: "volunteerId"
            };
            $.table.init(options);
        });

        //  学历字典数据
        let degree_dict = [[${@dict.getType('degree')}]];
        //  根据字典的学历格式转化器
        function fm_degree(value, row ,index) {
            return $.table.selectDictLabel(degree_dict, value);
        }

        //  学院字典数据
        let academy_dict = [[${@dict.getType('academy')}]];
        //  根据字典的学院格式转化器
        function fm_academy(value, row ,index) {
            return $.table.selectDictLabel(academy_dict, value);
        }

        //  命令
        function fm_commands(value, row, index){
            var actions = [];

            if (row.enrollState === 1) {
                actions.push('<a class="btn1 btn btn-success btn-xs ' + editFlag + '" href="javascript:void(0)" onclick="detail(\'' + row.volunteerId + '\')"><i class="fa fa-edit"></i>详情</a> ');
                actions.push('<a class="btn2 btn btn-success btn-xs " href="javascript:void(0)" onclick="accept(\'' + row.enrollId + '\')"><i class="fa fa-edit"></i>通过</a> ');
                actions.push('<a class="btn3 btn btn-success btn-xs " href="javascript:void(0)" onclick="refuse(\'' + row.enrollId + '\')"><i class="fa fa-edit"></i>拒绝</a> ');
            } else if (row.enrollState === 6) {
              actions.push('<a class="btn1 btn btn-success btn-xs ' + editFlag + '" href="javascript:void(0)" onclick="detail(\'' + row.volunteerId + '\')"><i class="fa fa-edit"></i>详情</a> ');
                actions.push('<a class="btn4 btn btn-success btn-xs " href="javascript:void(0)" onclick="change(' + row.enrollId + ',' + row.postId + ')"><i class="fa fa-edit"></i>更换岗位</a> ');
                actions.push('<a class="btn5 btn btn-success btn-xs " href="javascript:void(0)" onclick="$.operate.remove(\'' + row.enrollId + '\')"><i class="fa fa-edit"></i>移除</a> ');
            } else {
              actions.push('<a class="btn1 btn btn-success btn-xs ' + editFlag + '" href="javascript:void(0)" onclick="detail(\'' + row.volunteerId + '\')"><i class="fa fa-edit"></i>详情</a> ');
            }
            return actions.join('');
        }

        function addMember() {
          let url = prefix + "/member/[[${activityId}]]";
          $.modal.open("添加成员", url);
        }

        function detail(volunteerId) {
          let url = "/vtsp/volunteer/detail/"+volunteerId;
          $.modal.open("详情", url);
        }

        function refuse(enrollId) {
          let url = prefix + "/edit";
          let data = { enrollId, "enrollState": 3};
          $.operate.post(url, data);
        }

        function accept(enrollId) {
          let url = prefix + "/edit";
          let data = { enrollId, "enrollState": 6};
          $.operate.post(url, data);
        }

        function change(enrollId,postId) {
            var url = prefix + '/change/' + enrollId+'/'+postId;
            $.modal.open("更换岗位", url);
        }


        /** 状态（1：待选拔        3：未录用      6：已录用） */
        //  查询待审批的志愿者信息
        function dai() {
            let node = document.getElementById("enrollState");
            node.setAttribute("value", "1");
            $.table.search();
            $(".btn6").show()
            $(".btn7").hide()
        }

        //  查询审核通过的志愿者信息
        function yi() {
            let node = document.getElementById("enrollState");
            node.setAttribute("value", "6");
            $.table.search();
            $(".btn6").show()
            $(".btn7").show()
        }

        //  查询审核不通过的志愿者信息
        function wei() {
            let node = document.getElementById("enrollState");
            node.setAttribute("value", "3");
            $.table.search();
            $(".btn6").show()
            $(".btn7").hide()
        }

        //  重置全部的选择条件，
        function reset() {
            let node = document.getElementById("enrollState");
            node.setAttribute("value", "");
            $.form.reset();
        }

        /** 同意入队申请的实现 */
        //  批量同意多条申请
        function acceptAll(id) {
            let rows = $('#bootstrap-table').bootstrapTable('getSelections');
            let idArr = [];
            if(id) {
                console.log(1);
                idArr[0] = id;
            }
            else if(rows) {
                for (let i = 0; i < rows.length; i++) {
                    idArr[i] = rows[i].volunteerId;
                }
            }
            let ids = idArr.join(",");
            $.modal.confirm("确定同意这些申请吗？");
            let url = prefix + "/acceptAll";
            let data = { "ids": ids};
            $.operate.submit(url, "post", "json", data);
        }

        // /** 拒绝入队申请的实现 */
        // //  拒绝弹窗1，由本页触发，弹出div#refuse
        // function showRefuseModal1() {
        //     document.getElementById("refuse").style.display = "block";
        //     document.getElementById("mask").style.display = "block";
        // }
        //
        // //  此变量用于暂存查看页传来的volunteerId
        // let idArr = [];
        //
        // //  拒绝弹窗2，由子页edit触发，并传过来id，并暂存于idArr中，弹出div#refuse
        // function showRefuseModal2(id) {
        //     idArr[0] = id;
        //     document.getElementById("refuse").style.display = "block";
        //     document.getElementById("mask").style.display = "block";
        // }
        //
        // //  关闭div#refuse弹窗1，判断idArr是否为空，如果不为空则重新弹出查看页
        // function closeRefuseModal1() {
        //     document.getElementById("refuse").style.display = "none";
        //     document.getElementById("mask").style.display = "none";
        //     document.getElementById("refuseReason").value = "";
        //     document.getElementById("refuseDescription").value = "";
        //     if (idArr.length === 1) {
        //         $.operate.edit(idArr[0]);
        //     }
        //     //  重置idArr为空
        //     idArr = [];
        // }
        //
        // //  关闭div#refuse弹窗2
        // function closeRefuseModal2() {
        //     document.getElementById("refuse").style.display = "none";
        //     document.getElementById("mask").style.display = "none";
        //     document.getElementById("refuseReason").value = "";
        //     document.getElementById("refuseDescription").value = "";
        //     //  重置idArr为空
        //     idArr = [];
        // }
        //
        // //  批量拒绝多条申请
        // function refuseAll() {
        //     //  拒绝理由和原因描述的赋值
        //     let index = document.getElementById("refuseReason").selectedIndex;
        //     let refuseReason = document.getElementById("refuseReason").options[index].text;
        //     let refuseDescription = document.getElementById("refuseDescription").value;
        //     //  判断拒绝理由和原因描述是否非空
        //     if(refuseReason !== "" && refuseDescription !== "") {
        //         let refuseResult = "拒绝理由:" + refuseReason + "\t\t原因描述:" + refuseDescription;
        //         //  获取选中行ids(多个，批量)
        //         let rows = $('#bootstrap-table').bootstrapTable('getSelections');
        //         let array = [];
        //         //  若idArr非空，则为单个拒绝
        //         if(idArr.length === 1) {
        //             array = idArr;
        //         }
        //         else if(rows) {
        //             for (let i = 0; i < rows.length; i++) {
        //                 array[i] = rows[i].volunteerId;
        //             }
        //         }
        //         let ids = array.join(",");
        //         $.modal.confirm("确定拒绝这些申请吗？");
        //         let url = prefix + "/refuseAll";
        //         let data = { "ids": ids, "memo": refuseResult};
        //         $.operate.submit(url, "post", "json", data);
        //         closeRefuseModal2();
        //     }
        //     else if (refuseReason === ""){
        //         alert("请选择拒绝原因!!!");
        //     }
        //     else if (refuseDescription === "") {
        //         alert("请输入原因描述!!!");
        //     }
        // }
    </script>
</body>
</html>
